<template>
  <div>
    <!-- 
      需求：新增图书，点击新增按钮，把用户输入的书籍信息，传递给后台，并把结构打印在控制台
      1、静态布局
      2、给按钮绑定点击事件，并声明事件处理函数
      3、获取图书信息，双向绑定输入框
      4、调用接口实现新增图书信息
     -->
    <h1>3、新增图书信息</h1>
    <input v-model="obj.bookname" type="text" placeholder="书名"> <br>
    <input v-model="obj.author" type="text" placeholder="作者"> <br>
    <input v-model="obj.publisher" type="text" placeholder="出版社"> <br>
    <button @click="addBook">点击新增图书</button>
  </div>
</template>

<script>
import axios from "axios";
export default {
  data(){
    return {
      obj: {
        appkey: "7250d3eb-18e1-41bc-8bb2-11483665535a",
        bookname: "",
        author: "",
        publisher: ""
      }
    }
  },
  methods: {
    addBook(){
      axios({
        url: "http://123.57.109.30:3006/api/addbook",
        method: "post",
        data:this.obj
      }).then(res=>{
        console.log(38,res)
      })
    }
  }
}
</script>

<style>

</style>